/**
 * Created by necis on 2017/4/16.
 */

var data = [
    {
        "id": "#img_1",
        "offset": ['410', '-410']
    },
    {
        "id": "#img_2",
        "offset": ['211', '-320']
    },
    {
        "id": "#img_3",
        "offset": ['211', '-320']
    },
    {
        "id": "#img_4",
        "offset": ['20', '-400']
    },
    {
        "id": "#img_5",
        "offset": ['200', '-500']
    },
    {
        "id": "#img_6",
        "offset": ['100', '-280']
    },
    // {
    //     "id": "#img_7",
    //     "offset": ['100', '-500']
    // },
    {
        "id": "#img_8",
        "offset": ['50', '-550']
    },
    {
        "id": "#img_9",
        "offset": ['210', '-200']
    },
    {
        "id": "#img_10",
        "offset": ['210', '-420']
    },
    {
        "id": "#img_11",
        "offset": ['200', '-540']
    },
    {
        "id": "#img_12",
        "offset": ['-250', '-400']
    },
    {
        "id": "#img_13",
        "offset": ['-300', '-450']
    },
    {
        "id": "#img_14",
        "offset": ['-100', '-400']
    },
    {
        "id": "#img_15",
        "offset": ['200', '-300']
    },
    {
        "id": "#img_16",
        "offset": ['200', '-300']
    },
    {
        "id": "#img_17",
        "offset": ['250', '-500']
    },
    // {
    //     "id": "#img_18",
    //     "offset": ['-200', '-600']
    // },
    {
        "id": "#img_19",
        "offset": ['-200', '-180']
    },
    // {
    //     "id": "#img_20",
    //     "offset": ['300', '-300']
    // },
    {
        "id": "#img_21",
        "offset": ['10', '-320']
    },
    {
        "id": "#img_22",
        "offset": ['10', '-350']
    },
    {
        "id": "#img_23",
        "offset": ['-200', '-300']
    },
    {
        "id": "#img_24",
        "offset": ['100', '-420']
    },
    {
        "id": "#img_25",
        "offset": ['-230', '-500']
    },
    {
        "id": "#img_26",
        "offset": ['-150', '-340']
    },
    {
        "id": "#img_27",
        "offset": ['150', '-400']
    }
];

//数组打乱
data.sort(function () {
    return (0.5 - Math.random());
});

var flag1 = false, flag2 = false, flag3 = false;
var count = 0;
var time = 100;
var timeClose = (1000 / 60) * 8;
var timeBox = 1000;

$(function () {

    var loading = function (callback) {
        // console.log("start");
        /**
         * 将data-src的路径换成src路径
         */
        function loadImg() {
            var imgDom = document.getElementsByTagName("img");
            for (var i = 0; i < imgDom.length; i++) {
                var src = imgDom[i].getAttribute("data-src");
                if (src) {
                    imgDom[i].src = src;
                }
            }
        }

        var imageNames = [
            'images/address.png',
            'images/award.png',
            'images/close_1.png',
            'images/close_2.png',
            'images/close_3.png',
            'images/close_4.png',
            'images/close_5.png',
            'images/computer.png',
            'images/end.png',
            'images/host.png',
            'images/icon.png',
            'images/light.png',
            'images/man.png',
            'images/num_bg.png',
            'images/proximity_bg.jpg',
            'images/star.png',
            'images/woman.png',
            'images/yun.png',
            'images/bannao.png',
            'images/banidea.png',
            'images/banren.png',
            'images/hudie.png',
        ];

        var imagesCount = imageNames.length;
        var resourceCount = imagesCount;
        var loadedResourceCount = 0;
        var images = [];

        for (var i = 0; i < imagesCount; i++) {
            images[i] = new Image();
            images[i].src = imageNames[i];
            images[i].onload = function () {
                var progress = Math.ceil(100 * (++loadedResourceCount / resourceCount));
                // console.log(progress);
                // document.getElementById("progress_1").style.width = progress + "%";
                document.getElementById("progress").innerText = progress + "%";
                if (loadedResourceCount >= resourceCount) {
                    // console.log("end");
                    loadImg();
                    callback && callback();
                }
            };
        }
    };


    function loadCallback() {
        $("#loading").hide();
        $(".bg_box").show();

        var time=0;
        var setT1=setInterval(function () {
            time++;
            console.log(time);
            if(time===3){
                clearInterval(setT1);
                if(!isMove){
                    console.log(isMove);
                    data = [
                        {
                            "id": "#img_1",
                            "offset": ['410', '-410']
                        },
                        {
                            "id": "#img_2",
                            "offset": ['211', '-320']
                        },
                        {
                            "id": "#img_3",
                            "offset": ['211', '-320']
                        },
                        {
                            "id": "#img_4",
                            "offset": ['20', '-400']
                        },
                        {
                            "id": "#img_5",
                            "offset": ['200', '-500']
                        },
                        {
                            "id": "#img_6",
                            "offset": ['100', '-280']
                        },
                        {
                            "id": "#img_7",
                            "offset": ['100', '-500']
                        },
                        {
                            "id": "#img_8",
                            "offset": ['50', '-550']
                        },
                        {
                            "id": "#img_9",
                            "offset": ['210', '-200']
                        },
                        {
                            "id": "#img_10",
                            "offset": ['210', '-420']
                        },
                        {
                            "id": "#img_11",
                            "offset": ['200', '-540']
                        },
                        {
                            "id": "#img_12",
                            "offset": ['-250', '-400']
                        },
                        {
                            "id": "#img_13",
                            "offset": ['-300', '-450']
                        },
                        {
                            "id": "#img_14",
                            "offset": ['-100', '-400']
                        },
                        {
                            "id": "#img_15",
                            "offset": ['200', '-300']
                        },
                        {
                            "id": "#img_16",
                            "offset": ['200', '-300']
                        },
                        {
                            "id": "#img_17",
                            "offset": ['250', '-500']
                        },
                        {
                            "id": "#img_18",
                            "offset": ['-200', '-600']
                        },
                        {
                            "id": "#img_19",
                            "offset": ['-200', '-180']
                        },
                        {
                            "id": "#img_20",
                            "offset": ['-150', '-400']
                        },
                        {
                            "id": "#img_21",
                            "offset": ['10', '-320']
                        },
                        {
                            "id": "#img_22",
                            "offset": ['10', '-350']
                        },
                        {
                            "id": "#img_23",
                            "offset": ['-200', '-300']
                        },
                        {
                            "id": "#img_24",
                            "offset": ['100', '-420']
                        },
                        {
                            "id": "#img_25",
                            "offset": ['-230', '-500']
                        },
                        {
                            "id": "#img_26",
                            "offset": ['-150', '-340']
                        },
                        {
                            "id": "#img_27",
                            "offset": ['150', '-400']
                        }
                    ];

//数组打乱
                    data.sort(function () {
                        return (0.5 - Math.random());
                    });


                    $("#img_7").removeClass("renAnimate");
                    $("#img_18").removeClass("ideaAnimate");
                    $("#img_20").removeClass("naoAnimate");
                    $(".banren,.banidea,.bannao").fadeOut();
                    animate2();
                }
            }
        },1000);


        touchEvent("img_7").getTouch(callback1);
        touchEvent("img_20").getTouch(callback2);
        touchEvent("img_18").getTouch(callback3);

    }

    function closeBox() {
        var countClose = 1;

        setTimeout(function () {

            var set3 = setInterval(function () {
                var close2 = countClose + 1;
                if (countClose === 3) {
                    $(".pos1,.pos8,.pos12,.pos24,.pos20,.pos21").hide();
                }
                if (countClose === 5) {
                    $(".small").hide();
                    $(".icon").fadeOut();
                    setTimeout(function () {
                        $(".hudie").css({
                            "z-index":"6"
                        }).addClass("hudieAnimate");
                    },500);
                    setTimeout(function () {
                        $(".address,.end").fadeIn();
                    },1000);
                    clearInterval(set3);
                    return false;
                }
                $(".close_" + countClose).hide();
                $(".close_" + close2).show();
                countClose++;
            }, timeClose)
        }, timeBox);
    }

    function callback1() {
        $(".banren").fadeOut();
        // var t2 = Number($("#b").html());
        // $("#b").html(t2 + 1);
        flag1 = true;
        animate();
    }

    function callback2() {
        $(".bannao").fadeOut();
        // var t2 = Number($("#b").html());
        // $("#b").html(t2 + 1);
        flag2 = true;
        animate();
    }

    function callback3() {
        $(".banidea").fadeOut();
        // var t2 = Number($("#b").html());
        // $("#b").html(t2 + 1);
        flag3 = true;
        animate();
    }

    function animate() {
        if(flag1 && flag2 && flag3){
            touchEvent("img_7").remove(callback1);
            touchEvent("img_20").remove(callback2);
            touchEvent("img_18").remove(callback3);
            setTimeout(function () {

                var set = setInterval(function () {
                    var t1 = Number($("#a").html());
                    var t2 = Number($("#b").html());
//           console.log(t2);
                    if (t1 === 4 && t2 === 2) {
                        // console.log("end");
                        clearInterval(set);
                        return false;
                    }
                    if (t2 === 9) {
                        t2 = Number(0);
                        $("#a").html(t1 + 1);
                        $("#b").html(t2);
                    } else {
                        $("#b").html(t2 + 1);
                    }
                }, time);

                var set2 = setInterval(function () {

                    if (count > data.length - 1) {
                        clearInterval(set2);
                        closeBox();

                        return false;
                    }
                    new Parabola({
                        // el: "#img_3",
                        el: data[count].id,
                        offset: data[count].offset,
//        curvature: 0.005,
//                 curvature: 0.008,
                        curvature: 0.03,
                        duration: 500,
                        callback: function () {
//            alert("完成后回调")
                        },
                        stepCallback: function (x, y) {
//            console.log(x, y);
//            $("<div>").appendTo("body").css({
//                "position": "absolute",
//                "top": this.elOriginalTop + y,
//                "left": this.elOriginalLeft + x,
//                "background-color": "#CDCDCD",
//                "width": "5px",
//                "height": "5px",
//                "border-radius": "5px"
//            });
                        },
                        autostart: true
                    });

                    count++;
                }, time);

            },1000);
        }
    }

    function animate2() {
        touchEvent("img_7").remove(callback1);
        touchEvent("img_20").remove(callback2);
        touchEvent("img_18").remove(callback3);
        setTimeout(function () {

            var set = setInterval(function () {
                var t1 = Number($("#a").html());
                var t2 = Number($("#b").html());
//           console.log(t2);
                if (t1 === 4 && t2 === 2) {
                    // console.log("end");
                    clearInterval(set);
                    return false;
                }
                if (t2 === 9) {
                    t2 = Number(0);
                    $("#a").html(t1 + 1);
                    $("#b").html(t2);
                } else {
                    $("#b").html(t2 + 1);
                }
            }, time);

            var set2 = setInterval(function () {

                if (count > data.length - 1) {
                    clearInterval(set2);
                    closeBox();

                    return false;
                }
                new Parabola({
                    // el: "#img_3",
                    el: data[count].id,
                    offset: data[count].offset,
//        curvature: 0.005,
//                 curvature: 0.008,
                    curvature: 0.03,
                    duration: 500,
                    callback: function () {
//            alert("完成后回调")
                    },
                    stepCallback: function (x, y) {
//            console.log(x, y);
//            $("<div>").appendTo("body").css({
//                "position": "absolute",
//                "top": this.elOriginalTop + y,
//                "left": this.elOriginalLeft + x,
//                "background-color": "#CDCDCD",
//                "width": "5px",
//                "height": "5px",
//                "border-radius": "5px"
//            });
                    },
                    autostart: true
                });

                count++;
            }, time);

        },1000);
    }

    loading(loadCallback);
});


